<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@taglib uri="http://struts.apache.org/tags-html-el" prefix="html-el" %>
<%@taglib uri="http://struts.apache.org/tags-bean-el" prefix="bean-el" %>
<%@taglib uri="http://struts.apache.org/tags-bean" prefix="bean" %>
<%@taglib uri="http://struts.apache.org/tags-logic-el" prefix="logic-el" %>
<%@taglib uri="/WEB-INF/tld/application.tld" prefix="app" %>

<html-el:form action="/cadastroTurma.do">
	<html-el:hidden property="method" styleId="method"/>  
	<table style="width: 100%">
		<tr>
			<td align="center" valign="top">
				<!-- CONTENT -->			
				<div class="content">
					<table class="con">
						<tr>
							<td>
								<table class="breadory">
									<tr>
										<td>Cadastro de Turma</td>
									</tr>
								</table>
								<table style="width:850px">
									<tr>
										<td style="height:5px"></td>
									</tr>
									<tr>
										<td valign="top">
											<table class="formulario">
												<tr>
													<td class="label" style="width:40px">Início:</td>
													<td style="text-align: left">
														<input type="text" id="dataInicio" name="dataInicio" value="${CadastroTurmaForm.dataInicio}" style="font-size:14px;width:110px" title="Data Vencimento" constraints="{datePattern:'dd/MM/yyyy', strict:true}" data-dojo-type="dijit.form.DateTextBox" data-dojo-props="required:true, invalidMessage:'Data Inválida!'" />
													</td>
													<td style="width:20px"></td>
													<td class="label" style="width:40px"></td>
													<td style="text-align: left"></td>
													<td style="width:30px"></td>
													<td class="buttons" align="right" valign="bottom" rowspan="2" width="100%">
														<a href="javascript:consultar()" class="button" id="btnConsultar">
															<span>Consultar</span>
														</a>
														<a href="javascript:limparCampos()" class="button" id="btnLimpar">
															<span>Limpar</span>
														</a>
													</td>
												</tr>
												<tr>
													<td class="label">Curso:</td>
													<td class="inputField">
														<app:comboCurso styleId="curso" title="Curso" selected="${CadastroTurmaForm.curso}" style="width:250px"/>
													</td>
													<td style="width:10px"></td>
													<td class="label">Período:</td>
													<td class="inputField">
														<app:comboPeriodo styleId="periodo" title="Período" selected="${CadastroTurmaForm.periodo}" style="width:150px"/>
													</td>
												</tr>
											</table>
										</td>
									</tr>
									<tr>
										<td style="height:10px"></td>
									</tr>
								</table>
								<table style="width:850px;height:400px">
									<tr>
										<td valign="top">
											<table style="width: 100%" class="tbDadosConsulta">
												<tr>
													<th style="width:25px"></th>
													<th style="width:150px">Data</th>
													<th>Curso</th>
													<th style="width:100px">Período</th>
													<th style="width:130px">Sala</th>
													<th style="width:150px">Instrutor</th>
													<th style="width:90px">Vagas</th>
												</tr>
												<logic-el:iterate id="bean" name="listaResultado" scope="request" indexId="i">
													<tr class="linha${i%2}">
														<td style="text-align: center">
															<html-el:radio property="idSelecionado" value="${bean.codigo}" onclick="selectItem(this)"/>
														</td>
														<td style="text-align: center">
															<bean:write name="bean" property="inicio" format="dd/MM/yy"/> - 
															<bean:write name="bean" property="termino" format="dd/MM/yy"/>
														</td>
														<td style="text-align: left">${bean.curso.nome}</td>
														<td style="text-align: center">${bean.periodo.descricao}</td>
														<td style="text-align: center">${bean.sala.descricao}</td>
														<td style="text-align: left">${bean.instrutor.nome}</td>
														<td style="text-align: center">${bean.vagas}</td>
													</tr>
												</logic-el:iterate>	
												<html-el:hidden property="idSelecionado"/>								
											</table>
										</td>
									</tr>
									<tr>
										<td class="buttons" align="right" valign="bottom">
											<a href="javascript:detalhe()" class="button" id="btnDetalhe" style="visibility: hidden;">
												<span>Detalhes</span>
											</a>
											<a href="javascript:excluir()" class="button" id="btnExcluir" style="visibility: hidden;">
												<span>Excluir</span>
											</a>
											<a href="javascript:alterar()" class="button" id="btnAlterar" style="visibility: hidden;">
												<span>Alterar</span>
											</a>
											<a href="javascript:incluir()" class="button">
												<span>Incluir</span>
											</a>
										</td>
									</tr>
								</table>							
							</td>
						</tr>						
					</table>	
				</div>	
			</td>
		</tr>
	</table>
	</html-el:form>
	<div id="dialogIncluir" data-dojo-type="dijit.Dialog" title="Turma - Incluir">
		<table class="formulario" style="width:400px">
			<tr>
				<td class="label">Curso:</td>
				<td class="inputField">
					<app:comboCurso styleId="cursoIncluir" title="Curso" style="width:300px" onchange="selecionaCurso('cursoIncluir', 'periodoIncluir','dataInicioIncluir')"/>
				</td>
			</tr>
			<tr>
				<td class="label">Período:</td>
				<td class="inputField">
					<select id="periodoIncluir" style="width:300px" disabled="disabled" onchange="selecionaPeriodo('dataInicioIncluir', 'cursoIncluir','periodoIncluir','salaIncluir','instrutorIncluir')">
						<option value="">Selecione...</option>
					</select>
				</td>
			</tr>
			<tr>
				<td class="label">Data Início:</td>
				<td class="inputField">
					<input type="text" name="dataInicioIncluir" id="dataInicioIncluir" disabled="disabled" value="" style="font-size:14px" onchange="verificaData('dataInicioIncluir', 'cursoIncluir','periodoIncluir','salaIncluir','instrutorIncluir')" title="Data Início" constraints="{datePattern:'dd/MM/yyyy', strict:true, min:'${dataAtualDojo}'}" data-dojo-type="dijit.form.DateTextBox" data-dojo-props="required:true, invalidMessage:'Data Inválida!'"/>
				</td>
			</tr>
			<tr>
				<td class="label">Sala:</td>
				<td class="inputField">
					<select id="salaIncluir" style="width:300px" disabled="disabled" title="Sala de Aula">
						<option value="">Selecione...</option>
					</select>
				</td>
			</tr>
			<tr>
				<td class="label">Instrutor:</td>
				<td class="inputField">
					<select id="instrutorIncluir" style="width:300px" disabled="disabled" title="Instrutor">
						<option value="">Selecione...</option>
					</select>
				</td>
			</tr>
			<tr>
				<td class="buttons" align="right" valign="bottom" colspan="2">	
					<a href="javascript:incluirCancelar()" class="button">
						<span>Cancelar</span>
					</a>
					<a href="javascript:incluirConfirmar()" class="button">
						<span>Confirmar</span>
					</a>
				</td>
			</tr>
		</table>
	</div>
	<div id="dialogAlterar" data-dojo-type="dijit.Dialog" title="Turma - Alterar">
		<table class="formulario" style="width:400px">
			<tr>
				<td class="label">Curso:</td>
				<td class="inputField">
					<app:comboCurso styleId="cursoAlterar" title="Curso" style="width:300px" onchange="selecionaCurso('cursoAlterar', 'periodoAlterar','dataInicioAlterar')"/>
				</td>
			</tr>
			<tr>
				<td class="label">Período:</td>
				<td class="inputField">
					<select id="periodoAlterar" style="width:300px" onchange="selecionaPeriodo('dataInicioAlterar', 'cursoAlterar','periodoAlterar','salaAlterar','instrutorAlterar')">
						<option value="">Selecione...</option>
					</select>
				</td>
			</tr>
			<tr>
				<td class="label">Data Início:</td>
				<td class="inputField">
					<input type="text" name="dataInicioAlterar" id="dataInicioAlterar" value="" style="font-size:14px" onchange="verificaData('dataInicioAlterar', 'cursoAlterar','periodoAlterar','salaAlterar','instrutorAlterar')" title="Data Início" constraints="{datePattern:'dd/MM/yyyy', strict:true, min:'${dataAtualDojo}'}" data-dojo-type="dijit.form.DateTextBox" data-dojo-props="required:true, invalidMessage:'Data Inválida!'"/>
				</td>
			</tr>
			<tr>
				<td class="label">Sala:</td>
				<td class="inputField">
					<select id="salaAlterar" style="width:300px" title="Sala de Aula">
						<option value="">Selecione...</option>
					</select>
				</td>
			</tr>
			<tr>
				<td class="label">Instrutor:</td>
				<td class="inputField">
					<select id="instrutorAlterar" style="width:300px" title="Instrutor">
						<option value="">Selecione...</option>
					</select>
				</td>
			</tr>
			<tr>
				<td class="buttons" align="right" valign="bottom" colspan="2">	
					<a href="javascript:alterarCancelar()" class="button">
						<span>Cancelar</span>
					</a>
					<a href="javascript:alterarConfirmar()" class="button">
						<span>Confirmar</span>
					</a>
				</td>
			</tr>
		</table>
	</div>
	<div id="dialogDetalhe" data-dojo-type="dijit.Dialog" title="Turma - Detalhe">
		<div id="dialogDetalheContent"></div>
	</div>
<script language="javascript">

	var dataAtual = "${dataAtual}";
	
	function limparCampos() {
		document.getElementById('curso').value = "";
		document.getElementById('periodo').value = "";
		document.getElementById('dataInicio').value = "";
	}
	
	function selecionaCurso(curso, periodo, dataTurma) {
		
		var field = document.getElementById(curso);
		
		if(field.value == "") {
			document.getElementById(periodo).value = "";
			document.getElementById(periodo).disabled = true;
			dijit.byId(dataTurma).set('disabled', true);
			return;			
		}
				
		require(["dojo/_base/lang", "dojo/_base/xhr"], function(lang, xhr) {
			xhr.post({
		        url: "cadastroTurma.do?method=carregaPeriodoCurso",
		        timeout: ${ajaxTimeoutReturn},
		        handleAs: "json",
		        content: {
		        	ajax: 'true',
		        	curso:field.value
		        },
		        load: function(data, ioArgs) {
		        	
		        	var result = data;
		        	if(result[0] == false) {
		        		alert(result[1]);
		        		field.value = "";
		        		return false;
		        	} else {
		        		var list = data[1];
		        		document.getElementById(periodo).disabled = false;
			        	document.getElementById(periodo).options.length = 0;
			        	document.getElementById(periodo).options[0] = new Option("Selecione...", "");
			        	for(i=0; i<list.length; i++) {
			        		document.getElementById(periodo).options[i+1] = new Option(list[i], list[i]);
			        	}
			        	dijit.byId(dataTurma).set('disabled', true);
		        	}
		        },
				error: function(data, ioArgs) {
					showAlertMessage("Erro ao realizar está operação! Tente novamente!");
		        }
		    });
		});
		
	}
	
	function selecionaPeriodo(dataInicio, curso, periodo, sala, instrutor) {
		if(document.getElementById(periodo).value == "") {
			dijit.byId(dataTurma).set('disabled', true);
			return;
		}
		
		if(document.getElementById(dataInicio).value != "") {
			verificaData(dataInicio, curso, periodo, sala, instrutor);
		}
		
		dijit.byId(dataInicio).set('disabled', false);
	}

	function verificaData(dataInicio, curso, periodo, sala, instrutor) {
		
		var dataInformada = document.getElementById(dataInicio).value;
		if(dataInformada.length != 10) {
			alert("Data Inválida.\n Favor informar a data no formato dd/mm/aaaa.");
			document.getElementById(dataInicio).focus();
			return false;
		}
		
		var diaInformado = parseInt(dataInformada.substring(0,2));dataInformada
		var mesInformado = parseInt(dataInformada.substring(3,5));
		var diaAtual = parseInt(dataAtual.substring(0,2));
		var mesAtual = parseInt(dataAtual.substring(3,5));
		
		var funcao = "incluir";
		var selecionado = "";
		if(dataInicio.indexOf('Alterar') > -1) {
			funcao = "alterar";
			selecionado = getSelectedRadio('idSelecionado').value;
		}
		
		require(["dojo/_base/lang", "dojo/_base/xhr"], function(lang, xhr) {
			xhr.post({
		        url: "cadastroTurma.do?method=verificaData",
		        timeout: ${ajaxTimeoutReturn},
		        handleAs: "json",
		        content: {
		        	ajax: 'true',
		        	dataInicio:dataInformada,
		        	curso:document.getElementById(curso).value,
		        	periodo:document.getElementById(periodo).value,
		        	funcao:funcao,
		        	idSelecionado:selecionado
		        },
		        load: function(data, ioArgs) {
		        	
		        	var result = data;
		        	if(result[0] == false) {
		        		alert(result[1]);
		        		document.getElementById(field.id).value = "";
		        		return false;
		        	}
		        	
		        	var list = data[2]; //salas
	        		document.getElementById(sala).disabled = false;
		        	document.getElementById(sala).options.length = 0;
		        	document.getElementById(sala).options[0] = new Option("Selecione...", "");
		        	for(i=0; i<list.length; i++) {
		        		document.getElementById(sala).options[i+1] = new Option(list[i].descricao, list[i].codigo);
		        	}
		        	
		        	var list = data[3]; //instrutores
	        		document.getElementById(instrutor).disabled = false;
		        	document.getElementById(instrutor).options.length = 0;
		        	document.getElementById(instrutor).options[0] = new Option("Selecione...", "");
		        	for(i=0; i<list.length; i++) {
		        		document.getElementById(instrutor).options[i+1] = new Option(list[i].nome, list[i].codigo);
		        	}
		        	
		        },
				error: function(data, ioArgs) {
					showAlertMessage("Erro ao realizar está operação! Tente novamente!");
		        }
		    });
		});
		
	}

	function selectItem(i) {
		document.getElementById("btnAlterar").style.visibility = "visible";
		document.getElementById("btnExcluir").style.visibility = "visible";
		document.getElementById("btnDetalhe").style.visibility = "visible";
	}
	function consultar() {
		document.forms[0].method.value = "consultar";
		document.forms[0].submit();
	}
	function incluir() {
		document.getElementById('dataInicioIncluir').value = "";
		document.getElementById('cursoIncluir').value = "";
		document.getElementById('periodoIncluir').value = "";
		document.getElementById('salaIncluir').value = "";
		document.getElementById('instrutorIncluir').value = "";
		dijit.byId("dialogIncluir").show();
	}
	function incluirConfirmar() {
		
		if(!mandatoryField('dataInicioIncluir')) {
			return;
		}
		if(!mandatoryField('cursoIncluir')) {
			return;
		}
		if(!mandatoryField('periodoIncluir')) {
			return;
		}
		if(!mandatoryField('salaIncluir')) {
			return;
		}
		if(!mandatoryField('instrutorIncluir')) {
			return;
		}
		
		require(["dojo/_base/lang", "dojo/_base/xhr"], function(lang, xhr) {
			xhr.post({
		        url: "cadastroTurma.do?method=incluir",
		        timeout: ${ajaxTimeoutVoid},
		        content: {
		        	ajax: 'true',
		        	dataInicio:document.getElementById('dataInicioIncluir').value,
		        	curso:document.getElementById('cursoIncluir').value,
		        	periodo:document.getElementById('periodoIncluir').value,
		        	sala:document.getElementById('salaIncluir').value,
		        	instrutor:document.getElementById('instrutorIncluir').value
		        },
		        load: function(data, ioArgs) {
		        	alert("Turma incluída com sucesso!");
		        	consultar();
		        },
				error: function(data, ioArgs) {
					showAlertMessage("Erro ao realizar está operação! Tente novamente!");
		        }
		    });
		});
		
		dijit.byId("dialogIncluir").hide();
	}
	
	function incluirCancelar() {
		dijit.byId("dialogIncluir").hide();		
	}
	
	function alterar() {
		if(!mandatoryRadio('idSelecionado', 'Alteração')) {
			return;
		}
		require(["dojo/_base/lang", "dojo/_base/xhr"], function(lang, xhr) {
			xhr.post({
		        url: "cadastroTurma.do?method=alterarIniciar",
		        timeout: ${ajaxTimeoutReturn},
		        handleAs: "json",
		        content: {
		        	ajax: 'true',
		        	idSelecionado:getSelectedRadio('idSelecionado').value
		        },
		        load: function(data) {
		        	if(data[0] == true) {
			        	document.getElementById('cursoAlterar').value = data[1];
			        	document.getElementById('dataInicioAlterar').value = data[3];
			        	selecionaCurso('cursoAlterar', 'periodoAlterar','dataInicioAlterar');
			        	setTimeout("alterarContinuar('" + data[2] +"'," + data[4] + "," + data[5] + ")", 400); 
						dijit.byId("dialogAlterar").show();
		        	} else {
		        		alert(data[1]);
		        		return false;
		        	}
		        },
				error: function(data) {
					showAlertMessage("Erro ao realizar está operação! Tente novamente!");
		        }
		    });
		});
	}
	
	function alterarContinuar(periodo, sala, instrutor) {
    	document.getElementById('periodoAlterar').value = periodo;
    	verificaData('dataInicioAlterar', 'cursoAlterar','periodoAlterar','salaAlterar','instrutorAlterar');
    	setTimeout("document.getElementById('salaAlterar').value = " + sala + ";", 300);
    	setTimeout("document.getElementById('instrutorAlterar').value = " + instrutor + ";", 300);
    	dijit.byId('dataInicioAlterar').set('disabled', false);
	}
	
	function alterarConfirmar() {
		if(!mandatoryField('dataInicioAlterar')) {
			return;
		}
		if(!mandatoryField('cursoAlterar')) {
			return;
		}
		if(!mandatoryField('periodoAlterar')) {
			return;
		}
		if(!mandatoryField('salaAlterar')) {
			return;
		}
		if(!mandatoryField('instrutorAlterar')) {
			return;
		}
		
		require(["dojo/_base/lang", "dojo/_base/xhr"], function(lang, xhr) {
			xhr.post({
		        url: "cadastroTurma.do?method=alterar",
		        timeout: ${ajaxTimeoutVoid},
		        content: {
		        	ajax: 'true',
		        	dataInicio:document.getElementById('dataInicioAlterar').value,
		        	curso:document.getElementById('cursoAlterar').value,
		        	periodo:document.getElementById('periodoAlterar').value,
		        	sala:document.getElementById('salaAlterar').value,
		        	instrutor:document.getElementById('instrutorAlterar').value,
		        	idSelecionado:getSelectedRadio('idSelecionado').value},
		        load: function(data, ioArgs) {
		        	alert("Turma alterada com sucesso!");
		        	consultar();
		        },
				error: function(data, ioArgs) {
					showAlertMessage("Erro ao realizar está operação! Tente novamente!");
		        }
		    });
		});
		
		dijit.byId("dialogAlterar").hide();
	}
	
	function alterarCancelar() {
		dijit.byId("dialogAlterar").hide();		
	}
	
	function excluir() {
		if(!mandatoryRadio('idSelecionado', 'Exclusão')) {
			return;
		}
	
		if(!confirm("Deseja realmente excluir?")) {
			return;
		}	
		
		require(["dojo/_base/lang", "dojo/_base/xhr"], function(lang, xhr) {
			xhr.post({
		        url: "cadastroTurma.do?method=excluir",
		        timeout: ${ajaxTimeoutVoid},
		        handleAs: "json",
		        content: {
		        	ajax: 'true',
		        	idSelecionado:getSelectedRadio('idSelecionado').value
		        },
		        load: function(data, ioArgs) {
		        	if(data[0] == true) {
			        	alert("Turma excluída com sucesso!");
			        	consultar();
		        	} else {
		        		alert(data[1]);
		        	}
		        },
				error: function(data, ioArgs) {
					showAlertMessage("Erro ao realizar está operação! Tente novamente!");
		        }
		    });
		});
	}
	
	function detalhe() {
		
		if(!mandatoryRadio('idSelecionado', 'Exclusão')) {
			return;
		}
		
		require(["dojo/_base/lang", "dojo/_base/xhr"], function(lang, xhr) {
			xhr.post({
		        url: "cadastroTurma.do?method=detalhe",
		        timeout: ${ajaxTimeoutData},
		        handleAs: "text",
		        content: {
		        	ajax: 'true',
		        	idSelecionado:getSelectedRadio('idSelecionado').value
		        },
		        load: function(data, ioArgs) {
		    		document.getElementById("dialogDetalheContent").innerHTML = data;
		    		dijit.byId('dialogDetalhe').show();
		        },
				error: function(data, ioArgs) {
					showAlertMessage("Erro ao realizar está operação! Tente novamente!");
		        }
		    });
		});
	}
	function detalheCancelar() {
		dijit.byId('dialogDetalhe').hide();
	}
	
	function gerarRelacaoAlunosTaxi(codigo) {
		window.open("cadastroTurma.do?method=gerarRelacaoAlunosTaxi&idSelecionado="+codigo);
	}
	
	function gerarCertificados(codigo) {
		window.open("cadastroTurma.do?method=gerarCertificados&idSelecionado="+codigo);
	}
	
	function gerarTermoCredenciamentoTaxi(codigo) {
		window.open("cadastroTurma.do?method=gerarTermoCredenciamentoTaxi&idSelecionado="+codigo);
	}
	
</script>